<!-- 买入记录   -->
<template>
    <div class="buy_records">
      <van-nav-bar
        title="股份派发记录"
        left-arrow
        @click-left="$router.back()"
        left-text="返回"
      />
      <div v-if="buyRecordsList.length">
        <van-cell>
          <van-row style="text-align: center; vertical-align: center" align="center" type="flex" justify="space-between">
            <van-col span="6">时间</van-col>
            <van-col span="6">每股股价(￥)</van-col>
            <van-col span="6">获得数量</van-col>
            <!-- <van-col span="6">金额(￥)</van-col> -->
          </van-row>
        </van-cell>
        <van-cell  v-for="item in buyRecordsList" :key="item.id" style="font-size: 12px">
          <van-row type="flex" style="text-align:center" align="center" justify="space-between">
            <van-col span="6">{{item.accept_time}}</van-col>
            <van-col span="6">{{(item.price) }}</van-col>
            <van-col span="6">{{item.accept_amount}}</van-col>
            <!-- <van-col span="6">{{ (item.money / 1000).toFixed(3) }}</van-col> -->
          </van-row>
        </van-cell>
        <van-pagination
          v-model="pageIndex"
          style="margin-top: 3px"
          :total-items="totalRecord"
          :items-per-page="pageSize"
          force-ellipses
          @change="handleChange"
        />
      </div>

      <van-divider style="margin-top: 160px" v-else>暂无记录</van-divider>
    </div>
</template>

<script>
  export default {
    name: 'buyRecords',
    data(){
      return {
        buyRecordsList:[],
        pageIndex: 1,
        pageSize: 30,
        totalRecord: 0,
        stockId: '',
      }
    },
    created() {
      const stockId = JSON.parse(localStorage.getItem('stockItem')).id
      if (stockId){
        this.stockId = stockId
      }
    },
    mounted() {
      if (this.stockId){
        // 初始化
        const params = {
          id: this.stockId,
          pageIndex: this.pageIndex,
          pageSize: this.pageSize,
        }
        // 封装函数
        this.getPF(params)
      }
    },

    methods: {
      getPF(params){
        // 股份派发记录
        // todo 分页
        this.$api.stock.reqStockDistribution(params).then(res =>{
          if(res.code===200){
            this.buyRecordsList = res.data.items;
            this.totalRecord = res.data.total || res.data.count || 0;
          }
        })
      },

      handleChange(value) {
        const params = {
          id: this.stockId,
          pageIndex: value,
          pageSize: this.pageSize,
        };

        this._getBuyRecordList(params)
      },

    },
  }
</script>

<style scoped>

</style>
